<template>
  <el-card class="box-card" :body-style="{ padding: '0px' }" shadow="never">
    <div class="text item">
      <simple-add
        :mainService="mainService"
        :approvalFormMode="approvalFormMode"
        ref="basicForm"
        :service="service"
        :pageIsDraft="pageIsDraft"
        :pageName="pageName"
        :haveDraft="haveDraft"
        :parentPageType="parentPageType"
        :default-conditions="defaultConditions"
        :submit2-db="submit2Db"
        :default-values="setDefaultValues"
        :defaultCondition="defaultCondition"
        :srvval-form-model-decorator="srvvalFormModelDecorator"
        :parentAddMainFormDatas="parentMainFormDatas"
        :duplicateType="duplicateType"
        :duplicateData="duplicateData"
        @form-loaded="onAddFormLoaded"
        @srv-config-loaded="onSrvConfigLoaded($event)"
        @form-model-changed="onInnerFormModelChanged($event)"
        @action-complete="$emit('action-complete', $event)"
        @submitted2mem="onSubmitted2mem"
        @executor-complete="$emit('executor-complete', $event)"
        :childForeignkey="childForeignkey"
        :childrenLists="childrenList"
        :isPlatChildForm="isPlatChildForm"
      >
        <div
          slot="field-form-prepend"
          class="text item"
          v-if="childrenListLoaded && childListRun.form.prepend.length > 0"
        >
          <el-collapse v-model="buildCollapsedRun['form_prepend']">
            <template v-for="(item, index) in childListRun.form.prepend">
              <el-collapse-item
                :title="
                  item.foreign_key.section_name || item.foreign_key.table_name
                "
                v-show="showChildList(item)"
                :key="index"
                :name="'form_prepend_' + index"
              >
                <child-list
                  :pageIsDraft="pageIsDraft"
                  :key="index"
                  :childListConfig="item"
                  ref="childrenList"
                  :mainFormDatas="mainFormDatas"
                  :name="item.service_name"
                  storage-type="mem"
                  :readOnly="item.foreign_key.child_table_readonly == '是'"
                  :def-data-para="defDataPara"
                  :inplace-edit="true"
                  list-type="addchildlist"
                  :service="item.service_name"
                  :foreign-key="item.foreign_key"
                  :mainService="service"
                  :default-condition="item.defaultCondition"
                  :is-tree="!!item.parent_no_col"
                  :default-inplace-edit-mode="false"
                  default-dirty-flags="add"
                  :isTableForm="false"
                  :merge-col="false"
                  @update-form-loaded="$emit('update-form-loaded', $event)"
                  @add-form-loaded="$emit('add-form-loaded', $event)"
                  @grid-data-changed="onChildListDataChanged"
                  @list-loaded="onChildListLoaded"
                  @inline-list-loaded="onChildInlineListLoaded"
                >
                </child-list>
              </el-collapse-item>
            </template>
          </el-collapse>
        </div>
        <div
          slot="field-form-append"
          class="text item"
          v-if="childrenListLoaded && childListRun.form.append.length > 0"
        >
          <el-collapse v-model="buildCollapsedRun['form_append']">
            <template v-for="(item, index) in childListRun.form.append">
              <el-collapse-item
                :title="
                  item.foreign_key.section_name || item.foreign_key.table_name
                "
                v-show="showChildList(item)"
                :key="index"
                :name="'form_append_' + index"
              >
                <child-list
                  :mainService="service"
                  :pageIsDraft="pageIsDraft"
                  :key="index"
                  :childListConfig="item"
                  ref="childrenList"
                  :mainFormDatas="mainFormDatas"
                  :name="item.service_name"
                  storage-type="mem"
                  :def-data-para="defDataPara"
                  :inplace-edit="true"
                  list-type="addchildlist"
                  :readOnly="item.foreign_key.child_table_readonly == '是'"
                  :service="item.service_name"
                  :foreign-key="item.foreign_key"
                  :default-condition="item.defaultCondition"
                  :is-tree="!!item.parent_no_col"
                  :default-inplace-edit-mode="false"
                  default-dirty-flags="add"
                  :isTableForm="false"
                  :merge-col="false"
                  @update-form-loaded="$emit('update-form-loaded', $event)"
                  @add-form-loaded="$emit('add-form-loaded', $event)"
                  @grid-data-changed="onChildListDataChanged"
                  @list-loaded="onChildListLoaded"
                  @inline-list-loaded="onChildInlineListLoaded"
                >
                </child-list>
              </el-collapse-item>
            </template>
          </el-collapse>
        </div>

        <div
          :slot="col + '-child-prepend'"
          class="text item"
          v-for="(col, colIndex) in fieldChildKeys"
          :key="colIndex"
          v-if="childrenListLoaded && fieldChildKeys.length > 0"
        >
          <el-collapse v-model="buildCollapsedRun[col + '_prepend']">
            <template v-for="(item, index) in fieldChildRun[col].prepend">
              <el-collapse-item
                :title="
                  item.foreign_key.section_name || item.foreign_key.table_name
                "
                v-show="showChildList(item)"
                :key="index"
                :name="col + '_prepend_' + index"
              >
                <!--                <simple-add-->
                <!--                  :approvalFormMode="approvalFormMode"-->
                <!--                  ref="basicForms"-->
                <!--                  :service="'srvledu_practice_activity_reced_add'"-->
                <!--                  :childForeignkey='childForeignkey'-->
                <!--                ></simple-add>-->

                <!--                <iframe :src="`/dataview/#/sheet/${item.service_name}`" frameborder="0" style="width: 100%;height: 100%"></iframe>-->
                <!--                <custom-frame :name="item.service_name" :data="item"></custom-frame>-->
                <child-list
                  :item="item"
                  :mainService="service"
                  :pageIsDraft="pageIsDraft"
                  :key="index"
                  ref="childrenList"
                  :childListConfig="item"
                  :mainFormDatas="mainFormDatas"
                  :name="item.service_name"
                  storage-type="mem"
                  :def-data-para="defDataPara"
                  :inplace-edit="true"
                  list-type="addchildlist"
                  :service="item.service_name"
                  :readOnly="item.foreign_key.child_table_readonly == '是'"
                  :foreign-key="item.foreign_key"
                  :default-condition="item.defaultCondition"
                  :is-tree="!!item.parent_no_col"
                  :default-inplace-edit-mode="false"
                  default-dirty-flags="add"
                  :isTableForm="false"
                  :merge-col="false"
                  @update-form-loaded="$emit('update-form-loaded', $event)"
                  @add-form-loaded="$emit('add-form-loaded', $event)"
                  @grid-data-changed="onChildListDataChanged"
                  @list-loaded="onChildListLoaded"
                  @inline-list-loaded="onChildInlineListLoaded"
                >
                </child-list>
              </el-collapse-item>
            </template>
          </el-collapse>
        </div>
        <div
          :slot="col + '-child-append'"
          class="text item"
          v-for="(col, colIndex) in fieldChildKeys"
          :key="colIndex"
          v-if="childrenListLoaded && fieldChildKeys.length > 0"
        >
          <el-collapse v-model="buildCollapsedRun[col + '_append']">
            <template v-for="(item, index) in fieldChildRun[col].append">
              <el-collapse-item
                :title="
                  item.foreign_key.section_name || item.foreign_key.table_name
                "
                v-show="showChildList(item)"
                :key="index"
                :name="col + '_append_' + index"
              >
                <child-list
                  :mainService="service"
                  :pageIsDraft="pageIsDraft"
                  :key="index"
                  ref="childrenList"
                  :childListConfig="item"
                  :mainFormDatas="mainFormDatas"
                  :name="item.service_name"
                  storage-type="mem"
                  :readOnly="item.foreign_key.child_table_readonly == '是'"
                  :def-data-para="defDataPara"
                  :inplace-edit="true"
                  list-type="addchildlist"
                  :childForeignkey="childForeignkey"
                  :service="item.service_name"
                  :foreign-key="item.foreign_key"
                  :default-condition="item.defaultCondition"
                  :is-tree="!!item.parent_no_col"
                  :default-inplace-edit-mode="false"
                  default-dirty-flags="add"
                  :isTableForm="false"
                  :merge-col="false"
                  @update-form-loaded="$emit('update-form-loaded', $event)"
                  @add-form-loaded="$emit('add-form-loaded', $event)"
                  @grid-data-changed="onChildListDataChanged"
                  @list-loaded="onChildListLoaded"
                  @inline-list-loaded="onChildInlineListLoaded"
                >
                </child-list>
              </el-collapse-item>
            </template>
          </el-collapse>
        </div>
      </simple-add>
    </div>

    <!-- <div class="text item" v-if="childrenListLoaded">
        <el-collapse v-model="activeName">
          <template v-for="(item, index) in childrenList">
            <el-collapse-item
              :title="
                item.foreign_key.section_name || item.foreign_key.table_name
              "
              v-show="showChildList(item)"
              :key="index"
              :name="index"
            >
              <child-list
                :key="index"
                ref="childrenList"
                :mainFormDatas="mainFormDatas"
                :name="item.service_name"
                storage-type="mem"
                :def-data-para="defDataPara"
                :inplace-edit="true"
                list-type="addchildlist"
                :service="item.service_name"
                :foreign-key="item.foreign_key"
                :default-condition="item.defaultCondition"
                :is-tree="!!item.parent_no_col"
                :default-inplace-edit-mode="false"
                default-dirty-flags="add"
                :isTableForm="false"
                :merge-col="false"
                @update-form-loaded="$emit('update-form-loaded', $event)"
                @add-form-loaded="$emit('add-form-loaded', $event)"
                @grid-data-changed="onChildListDataChanged"
                @list-loaded="onChildListLoaded"
                @inline-list-loaded="onChildInlineListLoaded"
              >
              </child-list>
            </el-collapse-item>
          </template>
        </el-collapse>
      </div> -->
  </el-card>
</template>

<script>
import ChildList from "./child-list.vue";
import SimpleAdd from "./simple-add.vue";
import ParentChildMixin from "../mixin/parent-child-mixin";
import FieldRedundantMixin from "../mixin/field-redundant-mixin";
import customFrame from "../feature/excel-list.vue";
import cloneDeep from "lodash/cloneDeep";

export default {
  name: "add",
  components: {
    SimpleAdd,
    ChildList,
    customFrame,
  },
  mixins: [ParentChildMixin, FieldRedundantMixin],
  props: {
    defaultCondition: Array,
    childForeignkey: {
      type: Object,
    },
    service: {
      type: String,
    },
    defDataPara: {
      type: Object,
      default: function () {
        return null;
      },
    },
    haveDraft: {
      type: Boolean,
      default: false,
    },
    // for update/detail/add, it is loader's condition
    // for filter, it is default condition
    defaultConditions: {
      type: Array,
    },
    mainService: {
      type: String,
      default: "",
    },
    // for update/add, it is form fields default value
    defaultValues: {
      type: Object,
    },

    navAfterSubmit: {
      type: Boolean,
      default: true,
    },

    label: {
      type: String,
      default: "添加",
    },

    submit2Db: {
      type: Boolean,
      default: true,
    },

    parentMainFormDatas: {
      type: Object,
      default: function () {
        return null;
      },
    },

    pageIsDraft: {
      type: String,
      default: "norm",
    },
    parentPageType: {
      type: String,
      default: "",
    },
    duplicateType: String,
    duplicateData: Object,
  },

  data() {
    return {
      service_name: this.service || this.$route.params.service_name,
      activeName: 0,
      mainFormDatas: null,
      srv_more_config: {},
      _defaultValues: null,
    };
  },

  computed: {
    // mainDefaultValues(){
    //   return this.$parant
    // }
    setDefaultValues() {
      if (this._defaultValues) {
        return { ...this._defaultValues };
      }
      if (this.defaultValues) {
        return { ...this.defaultValues };
      }
    },
  },
  created() {
    // this.mainFormDatas = this.$emit('main-default-values',this)
    var operate_params = this.getOperateParams();
    if (operate_params) {
      var operate_Object = JSON.parse(operate_params);
      if (operate_Object?.data?.length > 0) {
        this._defaultValues = operate_Object.data[0];
      }
    }
  },
  methods: {
    onSrvConfigLoaded(e) {
      this.srv_more_config = e;
    },
    /**
     * 返回添加主子表数据的请求
     * @returns {{serviceName: (default.props.service|{type}|*), data: *[]}[]}
     */
    buildRunQuries() {
      // 主表数据
      let formModel = cloneDeep(this.srvValFormModel());
      delete formModel._children;

      let query = {
        serviceName: this.service_name,
        data: [formModel],
      };

      // 子表的数据
      let childDataList = [];
      if (this.$refs.childrenList) {
        this.$refs.childrenList.forEach((childList) => {
          let updateQueries = childList.buildRunQuries();
          if (updateQueries && updateQueries.length > 0) {
            childDataList = childDataList.concat(updateQueries);
          }
        });
      }

      // put in top level query
      query.data[0].child_data_list = childDataList;

      return [query];
    },

    /**
     * 获取子表元数据
     * @param form
     */
    onAddFormLoaded: function (form) {
      // 子表加载 v2
      this.$emit("form-loaded", this);
      // console.log("onAddFormLoaded")
      // if itself is submit2mem, no childlist
      if (
        this.submit2Db ||
        this.$parent?.getName?.()?.indexOf("childForm") === 0
      ) {
        this.buildChildrenList(form);
      }
    },

    onInnerFormModelChanged: function (e) {
      let self = this;
      // notify child list inplace edit redundant via js
      if (this.$refs && this.$refs.childrenList) {
        this.$refs.childrenList
          .filter((item) => item.isInplaceEdit())
          .forEach((childlist) => {
            let realList = childlist.$refs.list;
            realList.inplaceEditData.forEach((fieldsMap) => {
              let row = {};
              for (let key in fieldsMap) {
                let field = fieldsMap[key];
                if (field && field.getSrvVal) {
                  row[key] = field.getSrvVal();
                }
              }

              for (let key in fieldsMap) {
                let field = fieldsMap[key];
                if (field && field.getSrvVal) {
                  let vm = this;
                  this.handleRedundantViaJs(field, (_) => row, vm);
                }
              }
            });
          });
      }
      if (e.formModel !== undefined) {
        //  Vue.set('data', 'mainFormDatas', e.formModel)
        this.mainFormDatas = e.formModel;
      }
      if (this.mainFormDatas === null) {
        this.mainFormDatas = this.$refs.basicForm.getFormDatas();
      }
      this.$emit("onInnerFormModelChanged", e.formModel);
    },
    getMainFormData() {
      return this.mainFormDatas;
    },
  },
  watch: {
    srv_more_config: {
      //深度监听，可监听到对象、数组的变化
      handler(val, oldVal) {
        if (this.srv_more_config !== null) {
          if (val.hasOwnProperty("collapseAuto")) {
            if (val.collapseAuto && this.childrenList.length > 0) {
              this.activeName = [];
              for (let i = 0; i < this.childrenList.length; i++) {
                this.activeName.push(i);
              }
            }
          }
        }
      },
      deep: true, //true 深度监听
    },
    childrenListLoaded: {
      //深度监听，可监听到对象、数组的变化
      handler(val, oldVal) {
        if (this.srv_more_config !== null && val) {
          if (this.srv_more_config.hasOwnProperty("collapseAuto")) {
            if (
              this.srv_more_config.collapseAuto &&
              this.childrenList.length > 0
            ) {
              this.activeName = [];
              for (let i = 0; i < this.childrenList.length; i++) {
                this.activeName.push(i);
              }
            }
          }
        }
      },
    },
  },
};
</script>
